import React from 'react'
import { NavBar } from 'antd-mobile'
//导入自己的样式
//import './index.scss'
//导入module.css样式
import styles from './index.module.css'
//导入高阶组件
import { withRouter } from 'react-router-dom'
//导入props校验规则
import { PropTypes } from 'prop-types'

class NavHeader extends React.Component {
    constructor(props) {
        super(props)
        this.state = {}
    }

    render() {
        const {
            children,
            history,
            onLeftClick,
            className,
            rightContent } = this.props
        const defaultHandler = () => history.go(-1)
        return (

            <div className={styles.NavHeader}>
                {/* 导航栏 */}
                <NavBar
                    className={[styles.navBar, className || ''].join(' ')}
                    mode="light"
                    icon={<i className="iconfont icon-back" />}
                    onLeftClick={onLeftClick || defaultHandler}
                    rightContent={rightContent}
                >{children}</NavBar>
            </div >
        )
    }
}
NavHeader.propTypes = {
    children: PropTypes.string.isRequired,
    onLeftClick: PropTypes.func,
    className: PropTypes.string,
    rightContent: PropTypes.array
}

export default withRouter(NavHeader)

